<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="tephone=no,email=no,date=no,address=no">
    <title>title</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css"/>

    <style>
        #demo{
          width: 100%;
          height: 200px;
        }
        /* 新闻部分 */
        #news{
            height: 45px;
            display: -webkit-box;
            -webkit-box-align:center;
            border-bottom: 1px solid #ccc;
            overflow: hidden;
        }
        #news .left{
            margin-left: 5px;
        }
        #news .left img{
            width: 40px;
            height: auto;
            display: block;
        }
        #news .right{
            margin-left: 5px;
            -webkit-box-flex:1;
            margin-right: 2px;
        }
        #news .right .news-item{
            font-size: 11px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            color:#666 ;
            margin-top: 5px;
        }
        #news .right .fresh{
            display: inline-block;
            width: 20px;
            height: 12px;
            border:1px solid #f69991;
            border-radius: 2px;
            color: #f69991;
            font-size: 6px;
            text-align: center;
            line-height: 12px;
            margin-right: 7px;
        }
        #news_scroll{
        }
        #scroll-box{
            height: 40px;
            margin-top: 5px;
        }


        /* 用户 */
        #consumers{
            width: 300px;
            height: 155px;
            border:1px solid #f7a19a;
            border-radius: 8px;
            margin:6px auto 0;
            padding:10px;
        }
        #consumers h2{
            height: 20px;
            font-size: 14px;
            border-bottom: 1px solid #ececec;
            text-align: center;
        }
        #consumers .content{
            display: -webkit-box;
        }
        .content .left{
            width: 200px;
            margin-left: 10px;
        }
        .left{
          width: 38px;
          height: 36px;

        }
        #consumers-box{
            margin-top: 10px;
            font-size: 12px;
            padding:8px;
            position: relative;
        }
        .consumer{
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            height: 20px;
            width: 100%;
        }
        .content .right{
            -webkit-box-flex:1;
        }
        .content .right img{
            display: block;
            width: 88px;
            margin-top: 10px;
            height: 100px;
        }
        .conbox{
            position: absolute;
            z-index: 99;
            top: -85px;
            width: 95%;
            left:0px;
            height: 170px;
            background: #eee;
            overflow: hidden;
        }
        .imgcon{
          width: 55px;
          height: 13px;
        }

    </style>
</head>
<body>
     <div id="demo">

    </div>

    <div id="news">
        <div class="left">
            <!-- <img src="../image/国金投资logo.png" /> -->
            <img  src="../image/img11.png">
        </div>
        <div class="right">
            <marquee id="scroll-box" direction="up"   height="50" onmouseout="this.start()" onmouseover="this.stop()" scrollAmount="1" >
                <div id="news_scroll">
                    <div class="news-item"><span class="fresh">最新</span>弘扬夜郎文化中联夜郎集团举办“2017夜郎文化产业发展座谈会”</div>
                    <div class="news-item"><span class="fresh">最新</span>弘扬夜郎文化中联夜郎集团举办“2017夜郎文化产业发展座谈会”</div>
                    <div class="news-item"><span class="fresh">最新</span>弘扬夜郎文化中联夜郎集团举办“2017夜郎文化产业发展座谈会”</div>
                    <div class="news-item"><span class="fresh">最新</span>弘扬夜郎文化中联夜郎集团举办“2017夜郎文化产业发展座谈会”</div>
                    <div class="news-item"><span class="fresh">最新</span>弘扬夜郎文化中联夜郎集团举办“2017夜郎文化产业发展座谈会”</div>
                    <div class="news-item"><span class="fresh">最新</span>弘扬夜郎文化中联夜郎集团举办“2017夜郎文化产业发展座谈会”</div>
                    <div class="news-item"><span class="fresh">最新</span>弘扬夜郎文化中联夜郎集团举办“2017夜郎文化产业发展座谈会”</div>
                    <div class="news-item"><span class="fresh">最新</span>弘扬夜郎文化中联夜郎集团举办“2017夜郎文化产业发展座谈会”</div>
                </div>
            </marquee>
        </div>
    </div>

    <div id="consumers">
    <h2><img class="imgcon" src="../image/img.png"/></h2>
    <div class="content">
        <div class="left">
             <marquee id="consumers-box" direction="up"  height="85" onmouseout="this.start()" onmouseover="this.stop()" scrollAmount="3">
                <div class="conbox">
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                    <div class="consumer">浙江省xx,张先生,182xxxx0698,预约成功</div>
                </div>
            </marquee>
        </div>
        <div class="right">
            <img src="../image/img9.png">
        </div>
    </div>
</div>

</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript">
  // 轮播图

  	apiready = function(){
  		var UIScrollPicture = api.require('UIScrollPicture');
UIScrollPicture.open({
    rect: {
        x: 0,
        y: 0,
        w: api.winWidth,
        h: 200
        },
    data: {
        paths: [
            'widget://image/lunbo.jpg',
            'widget://image/lunbo2.jpg',
        ]
    },
    styles: {
        caption: {
            height: 35,
            color: '#E0FFFF',
            size: 13,
            bgColor: '#696969',
            position: 'bottom'
        },
        indicator: {
           dot:{
             w:20,
             h:10,
             r:5,
             margin:20
          },
            align: 'center',
            color: '#FFFFFF',
            activeColor: '#DA70D6'
	        }
	    },
	    placeholderImg: 'widget://res/slide1.jpg',
	    contentMode: 'scaleToFill',
	    interval: 3,
	    fixedOn: api.frameName,
	    loop: true,
	    fixed: false
	}, function(ret, err) {
	    if (ret) {
	    } else {
	        // alert(JSON.stringify(err));
	    }
	});

// 下拉
api.setRefreshHeaderInfo({
  visible: true,
  loadingImg: 'widget://image/refresh.png',
  bgColor: '#f0f0f0',
  textColor: '#888',
  textDown: '下拉刷新...',
  textUp: '松开刷新...',
  showTime: true
}, function(ret, err) {
  setTimeout(function(){
  api.refreshHeaderLoadDone();

 },1000)
});




  	}



</script>
</html>
